<template>
    <div>
        <van-cell-group>
            <van-field
                v-model="username"
                required
                clearable
                label="用户名"
                icon="question"
                placeholder="请输入用户名"
                @click-icon="$toast('请输入用户名')"
            />

            <van-field
                v-model="password"
                type="password"
                label="密码"
                placeholder="请输入密码"
                required
                icon="question"
                @click-icon="$toast('请输入登录密码')"
            />
            <van-field
                v-model="password2"
                type="password"
                label="确认密码"
                placeholder="请再次输入密码"
                required
                icon="question"
                @click-icon="$toast('请确认登录密码')"
            />
           <van-radio-group v-model="sex">
            <van-cell-group>
                <van-cell title="男" clickable @click="sex = '1'">
                <van-radio name="1" />
                </van-cell>
                <van-cell title="女" clickable @click="sex = '2'">
                <van-radio name="2" />
                </van-cell>
            </van-cell-group>
            </van-radio-group>
            <van-field
                v-model="checkcode"
                type="text"
                label="验证码"
                placeholder="请输入验证码"
                required
                icon="question"
                @click-icon="$toast('请输入验证码')"
            />
        </van-cell-group>
        <van-button size="large"  type="danger" plain @click="login">确认注册</van-button>
    </div>
</template>
<script>
import Vue from 'vue';
import { Field } from 'vant';
import { Button } from 'vant';
import { Toast } from 'vant';
import { RadioGroup, Radio } from 'vant';
Vue.use(Field).use(Button).use(Toast).use(RadioGroup).use(Radio);
export default {
    data(){
        return {
            username:'',
            password:'',
            password2:'',
            sex:'1',
            checkcode:''
        }
    },
    methods:{
        login(){
            if(this.username==''||this.password==''||this.password2==''||checkcode==''){
                Toast('请输入完整注册信息');
            }   
            if(this.password!=this.password2){
                Toast('两次密码输入不一致');
            }
        }
    }
}
</script>
<style lang="less">

</style>

